<template>
  <view>
    <view class="ware_main">
      <view class="uni-padding-wrap ware_le">
        <uni-segmented-control
          :current="current"
          :values="tabs"
          :style-type="'text'"
          :active-color="'#267DFF'"
          @clickItem="onClickTab"
        />
      </view>
    </view>

    <view style="padding-top: 72rpx">
      <view
        class="afim_main"
        v-for="(item, i) in dataList"
        :key="i"
        @click="onClickItem(item)"
      >
        <view class="img-box">
          <!-- 	<text class="tip-text-blue" v-if="item.status == 1">{{item.status_desc}}</text>
					<text class="tip-text-red" v-if="item.status == 2">{{item.status_desc}}</text>
					<text class="tip-text-green" v-if="item.status > 2">{{item.status_desc}}</text> -->
          <image
            class="list-img"
            src="@/static/img/default.png"
            v-if="item.pics.length == 0"
          ></image>
          <image
            class="list-img"
            :src="fileUrl + item.pics[0].pic_url"
            v-if="item.pics.length > 0"
          ></image>
        </view>

        <view class="afim_le">
          <view class="afim_list">
            <label>检修设备:</label>
            <text>{{ item.device_name }}</text>
          </view>
          <view class="afim_list">
            <label>检修票号:</label>
            <text>{{ item.overhaul_no }}</text>
          </view>
          <view class="afim_list">
            <label>申请人员:</label>
            <text>{{ item.create_user_name }}</text>
          </view>
          <view class="afim_list">
            <label>申请部门:</label>
            <text>{{ item.apply_dept_name }}</text>
          </view>
          <view class="afim_list">
            <label>申请时间:</label>
            <text>{{ item.create_date }}</text>
          </view>
        </view>
      </view>
    </view>
    <empty v-if="dataList.length == 0"></empty>
  </view>
</template>

<script>
import {
  FILE_URL,
  queryBeforeBiddingList,
  queryBiddingList,
} from '@/api/maintenance/selfs.js'
import Empty from '@/components/selfs/Empty.vue'
export default {
  components: {
    Empty,
  },
  data() {
    return {
      userName: '',
      userId: '',
      deptName: '',
      deptId: '',
      tabs: ['待竞价', '进行中', '成功', '失败'],
      current: 0,
      dataList: [],
      fileUrl: FILE_URL,
    }
  },
  methods: {
    onClickTab(e) {
      if (this.current !== e.currentIndex) {
        this.current = e.currentIndex
        this.fetchData()
      }
    },
    onClickItem(item) {
      if (this.current == 0) {
        uni.navigateTo({
          url:
            './bidding?type=0&userId=' +
            this.userId +
            '&userName=' +
            this.userName +
            '&deptId=' +
            this.deptId +
            '&deptName=' +
            this.deptName +
            '&jsonData=' +
            JSON.stringify(item),
        })
      } else {
        uni.navigateTo({
          url:
            './bidding?type=1&userId=' +
            this.userId +
            '&userName=' +
            this.userName +
            '&deptId=' +
            this.deptId +
            '&deptName=' +
            this.deptName +
            '&jsonData=' +
            JSON.stringify(item),
        })
      }
    },
    fetchData() {
      let params
      if (this.current == 0) {
        params = { user_id: this.userId }
        uni.showLoading({
          title: '正在查询...',
        })
        queryBeforeBiddingList(params).then((res) => {
          this.dataList = res.datas
        })
        uni.hideLoading()
      } else {
        params = { user_id: this.userId, status: this.current }
        uni.showLoading({
          title: '正在查询...',
        })
        queryBiddingList(params).then((res) => {
          this.dataList = res.datas
        })
        uni.hideLoading()
      }
    },
  },
  onLoad: function (e) {
    this.userName = e.userName
    this.userId = e.userId
    this.deptName = e.deptName
    this.deptId = e.deptId
    this.fetchData()
  },
  created: function () {
    // 订阅详情页回传值的监听
    uni.$on('bidding_refresh', (val) => {
      this.fetchData()
    })
  },
  beforeDestroy: function () {
    uni.$off('bidding_refresh')
  },
}
</script>

<style>
page {
  background: #f4f4f4;
}
.ware_main {
  width: 100%;
  margin: 0 auto;
  display: flex;
  justify-content: space-between;
  align-items: center;
  background: #ffffff;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 1;
}
.ware_le {
  width: 100%;
}
.afim_main {
  margin: 15upx;
  display: flex;
  justify-content: center;
  background: #ffffff;
  border-bottom: 1upx solid #f4f4f4;
  padding: 10upx;
  border-radius: 10upx;
}
.afim_le {
  width: 70%;
}
.afim_list {
  margin: 0upx auto;
}
.afim_le label {
  color: #267dff;
  font-size: 30upx;
}
.afim_le text {
  font-size: 30upx;
  padding-left: 20upx;
}
.afim_ri text {
  border: 2upx solid #267dff;
  color: #267dff;
  padding: 3upx 16upx;
  border-radius: 10upx;
  font-size: 30upx;
}
.afim_ri text:active {
  background: #267dff;
  color: #ffffff;
}
.img-box {
  width: 30%;
  height: 200rpx;
}
.list-img {
  width: 100%;
  height: 100%;
  background-repeat: no-repeat;
  padding: 15rpx;
}
.tip-text-blue {
  font-size: 28rpx;
  background-color: #007aff;
  color: #fff;
  padding: 5rpx 10rpx;
  border-radius: 2rpx;
}
.tip-text-red {
  font-size: 28rpx;
  background-color: #ff0000;
  color: #fff;
  padding: 5rpx 10rpx;
  border-radius: 2rpx;
}
.tip-text-green {
  font-size: 28rpx;
  background-color: #00cf00;
  color: #fff;
  padding: 5rpx 10rpx;
  border-radius: 2rpx;
}
</style>
